import { createRouter, createWebHistory,createWebHashHistory} from 'vue-router'
import HomeView from '../views/home/Home.vue'
import myck from '../views/myck.vue'
import store from '@/store/index'




// console.log("导入的store",store.state.count)

const routes = [
  {
    path: '/',
    name: 'home',
    component: HomeView,
    meta:{
      title:'首页',
      loginto:true,
    },
  },
  {
    path: '/about',
    name: 'about',
    meta:{
      title:'about页',
      loginto:true,
    },
    
    
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
  },
  {
    path: '/project',
    name: 'project',
    meta:{
      title:'项目',
      loginto:true,
    },
    component: () => import(/* webpackChunkName: "about" */ '../views/project/project.vue')
  },
  {
    path: '/news',
    name: 'news',
    meta:{
      title:'消息',
      loginto:true,
    },
    component: () => import(/* webpackChunkName: "about" */ '../views/news/news.vue')
  },
  {
    path: "/information",
    name: 'information',
    meta:{
      title:'mychiak2',
      loginto:true,
    },
    
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/info/infodetail.vue'),
    
  },
  {
    path: '/myck',
    name: 'myck',
    meta:{
      title:'我是myck',
      loginto:true,
    },
    
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component:myck,
    children:[
      {
        path: 'myck2',
        name: 'myck2',
        meta:{
          title:'mychiak2',
          loginto:true,
        },
        
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route
        // which is lazy-loaded when the route is visited.
        component: () => import(/* webpackChunkName: "about" */ '../views/myck2.vue'),
        children:[

        ]
      },
    ],

  },
  
  {
    path: "/echart",
    name: 'echart',
    meta:{
      title:'图表',
    },
    
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/echart/echart.vue'),
    
  },
  
  
  {
    path: "/404",
    name: '404',
    meta:{
      title:'找不到您的网页',
    },
    
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/404.vue'),
    
  },
  {
    // path: "*", // 这样用，vue3已经不支持，得下面的方式
    path: "/:pathMath(.*)", // 此处需特别注意置于最底部
    redirect: "/404"
  },
  {
    path:'/login',
    name:'login',
    component:() => import(/* webpackChunkName: "about" */ '../views/login/login.vue'),
    meta:{
      title:'登录'
    }
  }
]

const router = createRouter({
  // history: createWebHistory(process.env.BASE_URL),
  history:createWebHashHistory(),
  routes
})


router.beforeEach((to, from, next) => {
  
  
  /* 路由发生变化修改页面title */
  console.log('fulloath',to.fullPath)
   if(to.meta.loginto){
    // localStorage.removeItem('userinfoId')
    if(localStorage.getItem('userinfoId')!=null){
      
      next()
    }else{
      next(
        {
          path:"/login",
          query:{
            redirect:to.fullPath
          }
        }
      )
    }
   }

  if (to.meta.title) {
      document.title = to.meta.title;
  }else{
    document.title = '无标题';
  }
  next();
})

export default router
